<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="../css/normalize.css">
    <link rel="stylesheet" href="../css/common.css">
    <!-- 母版 -->
    <link rel="stylesheet" href="../css/muban.css">
    <!-- 放大镜样式 -->
    <link rel="stylesheet" href="../css/jquery.exzoom.css">
    <!-- 自己css -->
    <link rel="stylesheet" href="../css/particulars.css">
    <!-- jq -->
    <script src="../lib/jquery.min.js"></script>
    <!-- 放大镜插件 -->
    <script src="../lib/jquery.exzoom.js"></script>
    <!-- 当前js -->
    <script src="../js/particulars.js"></script>
</head>

<body>
    <!-- 头部 -->
    <div class="head  banner">

        <div class="head-top  clear-fd ">

            <div class="clear-fd type-area head-topa">
                <div class="head-img">
                    <h1><img src="../imgs/img/LOGO_02.jpg" alt=""></h1>
                </div>
                <div class="fl">legochina.cn</div>
                <div class=" fr">请&nbsp;登录\<a href="#">注册</a></div>
                <div class="fr">欢迎光临<a href="./home.html">乐购,</a></div>
            </div>
        </div>

        <div class="fr type-area head-searchh">
            <div class="head-search  type-area clear-fd  ">
                <input type="text" placeholder="创意文具" class="fl">
                <input type="text" value="" class="fl">
            </div>
            <div class="head-shopping  fr">
                <a href="#" class="head-shopping-small clear-fd">购物车 <span>3</span></a>
                <a href="#" class="head-shopping-smalls">我的订单</a>
            </div>
        </div>
        <div class="head-nav  type-area ">
            <ul class=" fr clearfix">
                <li><a href="./home.html">图书</a></li>
                <li><a href="./list.html">电子书</a></li>
                <li><a href="./particulars.html">原创文学</a></li>
                <li><a href="./register.html">登录</a></li>
                <li><a href="#">运动户外</a></li>
                <li><a href="#">孕婴童</a></li>
                <li><a href="#">家居</a></li>
                <li><a href="#">创意文具</a></li>
                <li><a href="#">地方特产</a></li>
                <li><a href="#">海外购</a></li>
                <li><a href="./shopping.html">购物</a></li>
            </ul>
        </div>
    </div>

    <!-- 图书产品详情 -->
    <div class="containerfluid bor">
        <p class="containerfluidhead type-area">
            <a href="#" class="fsize24 f00">图书</a>>
            <a href="#">小说</a> >
            <a href="#">情感/家庭/婚姻</a>>
            <a href="#">博集天卷</a>>
            <a href="#">她和他</a>
        </p>
        <div class="containerfluidcontent type-area bgcw">
            <!-- 放大镜 -->
            <div class=" fl clearfix" style="width: 340px; height: 466px;">
                <div class="exzoom" id="exzoom">
                    <!--大图区域-->
                    <div class="exzoom_img_box">
                        <ul class='exzoom_img_ul'>
                            <li><img src="../imgs/img/a1.png" /></li>
                            <li><img src="../imgs/img/a2.png" /></li>
                            <li><img src="../imgs/img/a3.png" /></li>
                            <li><img src="../imgs/img/a4.png" /></li>
                            <li><img src="../imgs/img/a5.png" /></li>
                            <li><img src="../imgs/img/a1.png" /></li>
                            <li><img src="../imgs/img/a2.png" /></li>
                            <li><img src="../imgs/img/a3.png" /></li>
                        </ul>
                    </div>
                    <!--缩略图导航-->
                    <div class="exzoom_nav"></div>
                    <!--控制按钮-->
                    <p class="exzoom_btn"> <a href="javascript:void(0);" class="exzoom_prev_btn"> &lt; </a> <a
                            href="javascript:void(0);" class="exzoom_next_btn"> &gt; </a> </p>
                </div>
                <!-- 文字 -->
                <div class="exzoom_text">商品编号：11950959</div>
            </div>
            <!-- 右边内容 -->
            <div class="containerfluidright  clearfix fr">
                <div class="containerfluidrighthead ">
                    <h2 class="fsize20 f00">她和他</h2>
                    <p class="fred">《偷影子的人》作者马克·李维重磅新作，法国连续60周在榜，销量突破120万册</p>
                    <p>[法] 马克·李维 著；杨亦雨 译</p>
                </div>
                <div class="containerfluidrightbody  bgch">
                    <div class="containerfluidrightbodyprice ">
                        <span class="fize16">乐 购 价：</span>
                        <span class="fseze18 fred">&yen;26.20</span>
                        <span class="fize16">[6.9折] [定价：<del>&yen;38.00</del>] (降价通知)</span>
                        <div class="fr clearfix">
                            累计评价
                            <div class="f60">999999</div>
                        </div>
                    </div>
                    <div class="containerfluidrightbodymessage  fize16 ">
                        <span>促销信息：</span>
                        <span class="fred">满减 每满150.00元，可减50.00元现金</span>
                        <span>详情 >></span>
                    </div>
                    <div class="containerfluidrightbodycoupon">
                        <span class="fize16">领 券:</span>

                        <span> <img src="../imgs/img/123.png" alt=""><span
                                class=" containerfluidrightbodycouponimgspan fwhile">100-6</span></span>
                        <span><img src="../imgs/img/123.png" alt=""><span
                                class="fwhile containerfluidrightbodycouponimgspan2">100-6</span></span>

                    </div>
                </div>
                <!-- js -->
                <div class="containerfluidrightkind   clearfix">
                    <h3 class="fl">种类选择:</h3>
                    <div class="fl">平 装 版</div>
                    <div class="fl">精 装 版</div>
                </div>
                <!-- js -->
                <div class="containerfluidrightshopp ">
                    <div class="containerfluidrightshoppnum clearfix fl">
                        <input type="text" class="shoppnum" type="text" value="1">
                        <div class=".containerfluidrightshoppnumdiv fr">
                            <div class="shoppnum1">+</div>
                            <div class="shoppnum2">-</div>
                        </div>

                    </div>
                    <button class="containerfluidrightshoppnuminput fr fsize24 clearfix  fwhile">加入购物车</button>
                </div>
                <p class="containerfluidrighttishi">&nbsp;&nbsp;温馨提示：支持7天无理由退货"</p>
            </div>
        </div>

    </div>

    <!-- 人气单品 -->
    <div class="type-area bookdiscount like clearfix">
        <div class="book-areatitle">
            <h2 class=" fsize22 bgcc fwhile">人气单品</h2>
        </div>
        <ul class="bookregion fl clearfix">
            <li class="bookregion1 fl clearfix bookregioncolor">
                <div class="bookregion1img">
                    <img src="../imgs/img/index3.jpg" alt="">
                    <img src="../imgs/img/index-1.png" alt="">
                </div>
                <p class="f00">白夜行 东野上吾</p>
                <div class="fred bookregion1remennd">
                    <span class="fize16">推荐:</span>
                    <img src="../imgs/img/xx1.png" alt="">
                </div>
                <div class="bookregion1price fl clearfix">
                    <span class="fred fl fsize22">&yen; :38</span>
                    <span class="bookregion1pricespan2 fl fsize22"><del class="">&yen;
                            :58</del></span>
                </div>


            </li>
            <script>
                for (let i = 1; i <= 4; i++) {
                    document.write(`<li class="bookregion1 fl clearfix ">
                <div class="bookregion1img">
                    <img src="../imgs/img/index3.jpg" alt="">
                    <img src="../imgs/img/index-1.png" alt="">
                </div>
                <p class="f00">白夜行 东野上吾</p>
                <div class="fred bookregion1remennd">
                    <span class="fize16">推荐:</span>
                    <img src="../imgs/img/xx1.png" alt="">
                </div>
                <div class="bookregion1price fl clearfix">
                    <span class="fred fl fsize22">&yen; :38</span>
                    <span class="bookregion1pricespan fl fsize22"><del>&yen; :58</del></span>
                </div>


            </li>`)
                }

            </script>


        </ul>


    </div>

    <!-- 看了又看 -->
    <div class="look type-area  clearfix">
        <div class="lookleft fl">
            <h2 class="fsize20">看了又看</h2>
            <ul class="bookregion fl clearfix">
                <li class="bookregion1 fl clearfix">
                    <div class="bookregion1img">
                        <img src="../imgs/img/index3.jpg" alt="">
                        <img src="../imgs/img/index-1.png" alt="">
                    </div>
                    <p class="f00 testin">白夜行 东野上吾</p>
                    <div class="fred testin bookregion1remennd">
                        <span class="fize16">推荐:</span>
                        <img src="../imgs/img/xx1.png" alt="">
                    </div>
                    <div class="bookregion1price fl clearfix">
                        <span class="fred fl fsize22 testin">&yen; :38</span>
                        <span class="bookregion1pricespan2 fl fsize22"><del class="">&yen;
                                :58</del></span>
                    </div>


                </li>
                <script>
                    for (let i = 1; i <= 6; i++) {
                        document.write(`<li class="bookregion1 fl clearfix ">
                    <div class="bookregion1img">
                        <img src="../imgs/img/index3.jpg" alt="">
                        <img src="../imgs/img/index-1.png" alt="">
                    </div>
                    <p class="f00 testin">白夜行 东野上吾</p>
                    <div class="fred bookregion1remennd testin">
                        <span class="fize16 ">推荐:</span>
                        <img src="../imgs/img/xx1.png" alt="">
                    </div>
                    <div class="bookregion1price fl clearfix">
                        <span class="fred fl fsize22 testin">&yen; :38</span>
                        <span class="bookregion1pricespan2 fl fsize22"><del>&yen; :58</del></span>
                    </div>
    
    
                </li>`)
                    }

                </script>


            </ul>


        </div>

        <!-- 右边 -->
        <div class="lookright bor fr">
            <div class="lookrighttitle clearfix">
                <h3 class="f00 fsize20 fl lookrighttitleh3">商品介绍</h3>
                <h3 class="f00 fsize20 fl">评价 (9999)</h3>
            </div>
            <div class="lookrightcontent">
                <img src="../imgs/img/03-产品详情-B.png" alt="">
            </div>
            <div class="lookrightcontent ds">
                <div class="lookrightcontenthead  bor clearfix">
                    <div class="lookheadbai  clearfix fl">
                        <h3 class="fsize52 fred fl">98%</h3>
                        <div class="fseze18 fl">好评度</div>
                    </div>
                    <div class="lookheadping  clearfix fr ">
                        <div class="lookheadping1  clearfix fl">
                            <div class="fl">好评(98%)</div>
                            <!-- <img src="../imgs/A2021-03-02 211020.png" alt="" class="fr "> -->
                            <div class="fl">中评(2%)</div>
                            <!--  <img src="../imgs/B2021-03-02 211145.png" alt="" class="fl"> -->
                            <div class="fl">差评(0%)</div>
                            <!--  <img src="../imgs/C2021-03-02 211227.png" alt="" class="fr"> -->
                            <div class="fr lookheadping1imgs ">
                                <img src="../imgs/A2021-03-02 211020.png" alt="" class="fl ">
                                <img src="../imgs/B2021-03-02 211145.png" alt="" class="fl">
                                <img src="../imgs/C2021-03-02 211227.png" alt="" class="fl">
                            </div>
                            <div class="lookheadping1ps fl  clearfix">
                                <p class="fl">1.洲**子 &emsp;&emsp;&emsp;+0 </p>
                                <p class="fr">2.洲**子 &emsp;&emsp;&emsp;+0 </p>
                                <p class="fl">3.洲**子&emsp;&emsp;&emsp; +10</p>
                                <p class="fr">4.洲**子&emsp;&emsp;&emsp;+10</p>

                            </div>
                        </div>
                    </div>

                </div>
                <!-- 列表 -->
                <div class="lookall ">
                    <ul class="lookallhead bgch clearfix">
                        <li class="fred fl">全部评价（9999）</li>
                        <li class="fl">好评（888）</li>
                        <li class="fl">中评（888）</li>
                        <li class="fl">差评（888）</li>
                    </ul>
                    <div class="lookallbody">
                        <ul class="lookallbodyul">
                            <li class="lookallbodyli1 clearfix  fl">
                                <div class="lookallbodyli1left fl">
                                    <img src="../imgs/xx2.png" alt="" class="fl">
                                    <p class="fb8">下单后5天评论</p>
                                    <p class="fb8">2016-08-11</p>
                                </div>
                            </li>
                            <li class="lookallbodyli2 fl clearfix">
                                <p class="fr">书的质量不错，很新，一点放久的潮味或臭味都没有，内容也值得一看，关
                                    键是价格真给力</p>
                            </li>
                            <li class="lookallbodyli3 fl  clearfix">
                                <img src="../imgs/111111.png" alt="" class="fl"> <span>洲**子"</span>
                                <p class="f4 fl">金牌会员</p>
                                <p class="fl">来自iPhone客户</p>
                            </li>
                        </ul>
                        <script>
                            for (let i = 1; i <= 11; i++) {
                                document.write(`
                                <ul class="lookallbodyul">
                            <li class="lookallbodyli1 clearfix  fl">
                                <div class="lookallbodyli1left fl">
                                    <img src="../imgs/xx2.png" alt="" class="fl">
                                    <p class="fb8">下单后5天评论</p>
                                    <p class="fb8">2016-08-11</p>
                                </div>
                            </li>
                            <li class="lookallbodyli2 fl clearfix">
                                <p class="fr">书的质量不错，很新，一点放久的潮味或臭味都没有，内容也值得一看，关
                                    键是价格真给力</p>
                            </li>
                            <li class="lookallbodyli3 fl  clearfix">
                                <img src="../imgs/111111.png" alt="" class="fl"> <span>洲**子"</span>
                                <p class="f4 fl">金牌会员</p>
                                <p class="fl">来自iPhone客户</p>
                            </li>
                        </ul>
                                `)
                            }
                        </script>
                    </div>
                </div>
            </div>
        </div>
    </div>

    </div>


    <!-- 尾页 -->
    <div class=" foot banner">
        <ul class="foot-hear">
            <li>
                <img src="../imgs/img/222_11.png" alt="">
                <img src="../imgs/img/222_13.png" alt="">
                <img src="../imgs/img/222_15.png" alt="">
                <img src="../imgs/img/222_17.png" alt="">
            </li>
        </ul>
        <div class="foot-centent ">
            <div class="foot-guide  clearfix">
                <ul class="fl clearfix">
                    <li><a href="#" class="foot-shopping fseze18 f00">购物指南</a></li>
                    <li><a href="#" class="fb8">购物流程</a></li>
                    <li><a href="#" class="fb8">发票制度</a></li>
                    <li><a href="#" class="fb8">账户管理</a></li>
                    <li><a href="#" class="fb8">会员优惠</a></li>
                </ul>
                <ul class="fl clearfix">
                    <li><a href="#" class="foot-shopping fseze18 f00">购物指南</a></li>
                    <li><a href="#" class="fb8">购物流程</a></li>
                    <li><a href="#" class="fb8">发票制度</a></li>
                    <li><a href="#" class="fb8">账户管理</a></li>
                    <li><a href="#" class="fb8">会员优惠</a></li>
                </ul>
                <ul class="fl clearfix">
                    <li><a href="#" class="foot-shopping fseze18 f00">购物指南</a></li>
                    <li><a href="#" class="fb8">购物流程</a></li>
                    <li><a href="#" class="fb8">发票制度</a></li>
                    <li><a href="#" class="fb8">账户管理</a></li>
                    <li><a href="#" class="fb8">会员优惠</a></li>
                </ul>
                <ul class="fl clearfix">
                    <li><a href="#" class="foot-shopping fseze18 f00">购物指南</a></li>
                    <li><a href="#" class="fb8">购物流程</a></li>
                    <li><a href="#" class="fb8">发票制度</a></li>
                    <li><a href="#" class="fb8">账户管理</a></li>
                    <li><a href="#" class="fb8">会员优惠</a></li>
                </ul>
                <ul class="fl clearfix">
                    <li><a href="#" class="foot-shopping fseze18 f00">购物指南</a></li>
                    <li><a href="#" class="fb8">购物流程</a></li>
                    <li><a href="#" class="fb8">发票制度</a></li>
                    <li><a href="#" class="fb8">账户管理</a></li>
                    <li><a href="#" class="fb8">会员优惠</a></li>
                </ul>
            </div>
            <div class="foot-legou">
                <img src="../imgs/img/logo_00.png" alt="">
            </div>
        </div>
        <div class="foot-brief  fl clearfix">

            <ul class="clearfix">
                <li>
                    <a href="#" class="fb8">会员简介<span>|</span></a>

                    <a href="#" class="fb8">lnverstor Relations<span>|</span></a>

                    <a href="#" class="fb8">网站联盟<span>|</span></a>

                    <a href="#" class="fb8">乐购招商<span>|</span></a>
                    <a href="#" class="fb8">机构销售<span>|</span></a>
                    <a href="#" class="fb8">手机乐购<span>|</span></a>
                    <a href="#" class="fb8">官方Blog<span>|</span></a>
                    <a href="#" class="fb8">热词搜索<span>|</span></a>
                </li>
            </ul>
        </div>
        <div class="foot-date ">
            <p>
                Copyright (C) 乐购网 2004-2016, A || Rights Reserver
            </p>
        </div>
    </div>
</body>

</html>